<template>
  <div id="home">
    <nav-bar class="home-nav">
      <div slot="mid">购物街</div>
    </nav-bar>
    <home-swiper :banners="banners"/>
    <recommands-view :recommends="recommends"/>
  </div>
</template>

<script>
  import NavBar from "../../components/common/navbar/NavBar";
  import {getHomeMultidata} from "../../network/home";
  import HomeSwiper from "./childrencomponents/HomeSwiper";
  import RecommandsView from "./childrencomponents/RecommendsView";
  export default {
    name:'Home',
    components:{
      NavBar,
      HomeSwiper,
      RecommandsView
    },
    data(){
      return{
        banners:[],
        recommends:[]
      }
    },
    created() {
        console.log('created');
        getHomeMultidata().then(res => {
        console.log(res);
        this.banners = res.data.banner.list
        this.recommends = res.data.recommend.list
      })
    }
  }

</script>

<style>
.home-nav{
  background-color:var(--color-tint);
  color: white;
}
</style>
